import React, { useRef, useEffect } from 'react';
import * as echarts from 'echarts';

const ChartComponent = () => {
    const chartRef = useRef(null);

    useEffect(() => {
        const chart = echarts.init(chartRef.current);
        const option = {
            xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed'] },
            yAxis: { type: 'value' },
            series: [{ type: 'line', data: [150, 230, 224] }]
        };
        chart.setOption(option);

        return () => chart.dispose(); // 组件卸载时销毁实例
    }, []);

    return <div ref={chartRef} style={{ width: '100%', height: '400px' }} />;
};

export default ChartComponent;